<template>
  <div class="outside">
      <swiper class="swiper"></swiper>
      <div class="category">
        <rec-playlist :title="title" :List="List" :num=5></rec-playlist>
        <!-- <div class="dujia">
          <p>独家放送</p>
        </div> -->
      </div>
  </div>
</template>

<script>
import {request} from 'network/request'
import Swiper from './childComps/Swiper'
import recPlaylist from './childComps/recPlaylist'
export default {
  name:'Recommend',
  components:{
    Swiper,
    recPlaylist
  },
  data(){
    return {
      List:[],
      title:'推荐歌单'
    }
  },
  methods:{
    async getList(){
      const data = await request("GET",'/personalized?limit=10')
      this.List = data.result
      // var result = []
      // for(var i=0;i<this.List.length;i+=5){
      //   result.push(this.List.slice(i,i+5));
      // }
      // this.List = result
    },
  },
  created(){  
    this.getList()
  }
}
  
</script>

<style scoped>
.outside{
  display:flex;
  justify-content:center;
  margin:5px 7% 50px;
  flex-direction: column;
  /* margin-bottom: 70px; */
}
/* .swiper{
  width: 8;
} */
.category{
  display: flex;
  flex-direction: column;
  margin-top: 25px;
}
/* .category div{ */
  /* margin: 13px 0; */
/* } */

</style>